<template>
  <div>
    <el-row :gutter="15">
      <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
        <el-col :span="14">
          <el-form-item label="楼盘名称" prop="flatName">
            <template>
              <label>楼盘名称:<input v-model="formData.flatName" class="lineinput" style="width:200px" size="mini"></label>
              <baidu-map class="map" :center="center" :zoom="zoom" @ready="handler"
                         :scroll-wheel-zoom="true"
                         @click="clickEvent"
                         ak="ssBLwQlH6f397LUgwN5R9BdKIB7S2njO">
                <bm-navigation anchor="BMAP_ANCHOR_TOP_RIGHT"></bm-navigation>
                <bm-city-list anchor="BMAP_ANCHOR_TOP_LEFT"></bm-city-list>
                <bm-geolocation anchor="BMAP_ANCHOR_BOTTOM_RIGHT"  :showAddressBar="true" :autoLocation="true" @locationSuccess="getLoctionSuccess" ></bm-geolocation>
                <bm-view :style="{width:'150%',height: '800px',flex: 1,marginTop:'0px'}"></bm-view>
                <bm-local-search :keyword="formData.flatName" :auto-viewport="false" :location="formData.flatName" style="height: 150px;overflow-y: scroll;margin: 2px 0"></bm-local-search>

              </baidu-map>
              <div class="demo-input-suffix" style="margin-top: 2vh">
                <el-link type="info">经度：</el-link><el-input  class="lineinput"  style="width:200px" size="mini" v-model.number="locData.longitude" :disabled="true"></el-input>
                <el-link type="info"> 纬度：</el-link><el-input  class="lineinput"  style="width:200px" size="mini" v-model.number="locData.latitude" :disabled="true"></el-input>
                <el-link type="info"> 位置：</el-link><el-input  class="lineinput"  style="width:200px" size="mini" v-model="locData.address" :disabled="true"></el-input>

              </div>

            </template>
            <el-button type="info" @click="changeUrl"> 添加楼盘</el-button>
          </el-form-item>


        </el-col>
        <!--<iframe name="iframeA" :src=url frameborder="0"  style="width: 100%;height:500px;" scrolling="no" ref="mapFrame"></iframe>-->
        <el-col :span="12">
          <el-form-item label="" prop="type">
            <el-radio-group v-model="formData.type" size="medium" >
              <el-radio label="0" @change="changeRadio(0)" >整租</el-radio>
              <el-radio label="1" @change="changeRadio(1)" >合租</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="11">
          <el-form-item label="" prop="status">
            <el-radio-group v-model="formData.status" size="medium">
              <el-radio v-for="(item, index) in statusOptions" :key="index" :label="item.value"
                        :disabled="item.disabled">{{item.label}}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="楼栋号" prop="buildingNo">
            <el-input v-model="formData.buildingNo" placeholder="请输入楼栋号" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="单元号" prop="unitNo">
            <el-input v-model="formData.unitNo" placeholder="请输入单元号" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="门牌号" prop="roomNo">
            <el-input v-model="formData.roomNo" placeholder="请输入门牌号" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="户型 室" prop="room">
            <el-select v-model="formData.room" placeholder="请选择户型" clearable :style="{width: '100%'}">
              <el-option v-for="(item, index) in roomOptions" :key="index" :label="item.label"
                         :value="item.value" :disabled="item.disabled"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="厅" prop="hall">

            <el-select v-model="formData.hall" placeholder="请选择" clearable :style="{width: '100%'}">
              <el-option v-for="(item, index) in hallOptions" :key="index" :label="item.label"
                         :value="item.value" :disabled="item.disabled"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="装修情况" prop="leaseType">
            <el-select v-model="formData.leaseType" placeholder="请选择装修情况" clearable :style="{width: '100%'}">
              <el-option v-for="(item, index) in leaseTypeOptions" :key="index" :label="item.label"
                         :value="item.value" :disabled="item.disabled"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="9">
          <el-form-item label="楼层" prop="floor">
            <el-input-number v-model="formData.floor" placeholder="楼层"></el-input-number>
          </el-form-item>
        </el-col>
        <el-col :span="9">
          <el-form-item label="共" prop="floorCount">
            <el-input-number v-model="formData.floorCount" placeholder="共"></el-input-number>
          </el-form-item>
        </el-col>
        <el-col :span="9">
          <el-form-item label="设置管家" prop="manager">
            <el-select v-model="formData.manager" placeholder="请选择设置管家" clearable :style="{width: '100%'}">
              <el-option v-for="(item, index) in managerOptions" :key="index" :label="item.label"
                         :value="item.value" :disabled="item.disabled"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="房产面积" prop="proportion">
            <el-input v-model="formData.proportion" placeholder="请输入房产面积" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="租金" prop="rental" v-show="shows">
            <el-input v-model="formData.rental" placeholder="请输入租金" clearable :style="{width: '100%'}">
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="付款方式  押" prop="paymentMortgage">
            <el-select v-model="formData.paymentMortgage" placeholder="请选择付款方式" clearable
                       :style="{width: '100%'}">
              <el-option v-for="(item, index) in paymentMortgageOptions" :key="index" :label="item.label"
                         :value="item.value" :disabled="item.disabled"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="付" prop="paymentPay">
            <el-select v-model="formData.paymentPay" clearable :style="{width: '100%'}">
              <el-option v-for="(item, index) in paymentPayOptions" :key="index" :label="item.label"
                         :value="item.value" :disabled="item.disabled"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="公共配套" prop="publicfacility">
            <el-checkbox-group v-model="formData.publicfacility" size="medium">
              <span v-for="item in publicFacilityOptions">
                <el-checkbox  :value="item.value" :label="item.value">{{item.label}}</el-checkbox>
              </span>
            </el-checkbox-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="房间配套" prop="privatefacility" v-show="shows">
            <el-checkbox-group v-model="formData.privatefacility" size="medium">
              <span v-for="item in privateFacilityOptions">
                <el-checkbox   :value="item.value" :label="item.value">{{item.label}}</el-checkbox>
              </span>
            </el-checkbox-group>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="房间区域图片" prop="frontCover" required v-show="shows">
            <el-upload
              class="avatar-uploader"
              action="http://localhost/dev-api/file/upload"
              :show-file-list="false"
              :on-success="handleAvatarSuccess"
              :before-upload="beforeAvatarUpload">
              <img v-if="imageUrl" :src="imageUrl" class="avatar">
              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
            </el-upload>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="公共区域图片" prop="pictureUrl" required>
            <el-upload
              class="avatar-uploader"
              action="http://localhost/dev-api/file/upload"
              :show-file-list="false"
              :on-success="handleAvatarSuccesss"
              :before-upload="beforeAvatarUploads">
              <img v-if="imageUrls" :src="imageUrls" class="avatar">
              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
            </el-upload>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="房源介绍" prop="introduce">
            <el-input v-model="formData.introduce" type="textarea" placeholder="请输入房源介绍" :maxlength="100"
                      :autosize="{minRows: 4, maxRows: 4}" :style="{width: '100%'}"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item size="large">
            <el-button type="primary" @click="submitForm">提交</el-button>
            <el-button @click="resetForm">重置</el-button>
          </el-form-item>
        </el-col>
      </el-form>
    </el-row>
  </div>
</template>
<script>
 // import {addDistract,getPublicFacilityOptions,getPrivateFacilityOptions,getManagerOptions } from "@/api/termination/distract";
 import {BaiduMap,BmNavigation,BmView,BmGeolocation,BmCityList,BmLocalSearch} from 'vue-baidu-map'
  import {Pagination} from "element-ui";
  export default {
    name: "index",
    components: {},
    props: [],
    data() {
      return {
        center: {lng: 111.752912, lat: 40.832246},
        zoom: 12,
        mapVisible:false,
        locData:{
          longitude:'',
          latitude:'',
          address:'',
        },
        iconUrl:'http://api0.map.bdimg.com/images/marker_red_sprite.png',
        imageUrl:"",
        imageUrls:"",
        shows:true,
        url:"https://map.baidu.com/@12961205,4823961,13z",
        formData: {
          publicfacility:[],
          privatefacility:[],
          flatName: '',
          type: undefined,
          status: undefined,
          buildingNo: undefined,
          unitNo: undefined,
          roomNo: undefined,
          room: undefined,
          hall: undefined,
          leaseType: undefined,
          floor: undefined,
          floorCount: undefined,
          manager: undefined,
          proportion: undefined,
          rental: undefined,
          paymentMortgage: undefined,
          paymentPay: undefined,
          publicFacility: "",
          privateFacility: "",
          frontCover: null,
          pictureUrl: null,
          introduce: undefined,
        },
        rules: {
          flatName: [{
            required: true,
            message: '请输入楼盘名称',
            trigger: 'blur'
          }],
          type: [{
            required: true,
            message: '不能为空',
            trigger: 'change'
          }],
          status: [{
            required: true,
            message: '不能为空',
            trigger: 'change'
          }],
          buildingNo: [],
          unitNo: [],
          roomNo: [],
          room: [{
            required: true,
            message: '请选择户型',
            trigger: 'change'
          }],
          hall: [{
            required: true,
            message: '请选择',
            trigger: 'change'
          }],
          leaseType: [{
            required: true,
            message: '请选择装修情况',
            trigger: 'change'
          }],
          floor: [{
            required: true,
            message: '楼层',
            trigger: 'blur'
          }],
          floorCount: [{
            required: true,
            message: '共',
            trigger: 'blur'
          }],
          manager: [{
            required: true,
            message: '请选择设置管家',
            trigger: 'change'
          }],
          proportion: [{
            required: true,
            message: '请输入房产面积',
            trigger: 'blur'
          }],
          rental: [{
            required: true,
            message: '请输入租金',
            trigger: 'blur'
          }],
          paymentMortgage: [{
            required: true,
            message: '请选择付款方式',
            trigger: 'change'
          }],
          paymentPay: [{
            required: true,
            message: '',
            trigger: 'change'
          }],
          publicfacility: [{
            required: true,
            type: 'array',
            message: '请至少选择一个公共配套',
            trigger: 'change'
          }],
          privatefacility: [{
            required: true,
            type: 'array',
            message: '请至少选择一个房间配套',
            trigger: 'change'
          }],
          introduce: [{
            required: true,
            message: '请输入房源介绍',
            trigger: 'blur'
          }],
        },
        typeOptions: [{
          "label": "整租",
          "value": 0
        }, {
          "label": "合租",
          "value": 1
        }],
        statusOptions: [{
          "label": "已出租",
          "value": 0
        }, {
          "label": "未出租",
          "value": 1
        }],
        roomOptions: [{
          "label": "1",
          "value": 1
        }, {
          "label": "2",
          "value": 2
        }, {
          "label": "3",
          "value": 3
        }, {
          "label": "4",
          "value": 4
        }, {
          "label": "5",
          "value": 5
        }, {
          "label": "6",
          "value": 6
        }, {
          "label": "7",
          "value": 7
        }, {
          "label": "8",
          "value": 8
        }, {
          "label": "9",
          "value": 9
        }],
        hallOptions: [{
          "label": "0",
          "value": 0
        }, {
          "label": "1",
          "value": 1
        }, {
          "label": "2",
          "value": 2
        }],
        leaseTypeOptions: [{
          "label": "精装",
          "value": 0
        }, {
          "label": "简装",
          "value": 1
        }, {
          "label": "毛坯",
          "value": 2
        }],
        managerOptions: [],
        paymentMortgageOptions: [{
          "label": "0",
          "value": 0
        }, {
          "label": "1",
          "value": 1
        }, {
          "label": "2",
          "value": 2
        }, {
          "label": "3",
          "value": 3
        }],
        paymentPayOptions: [{
          "label": "1",
          "value": 1
        }, {
          "label": "2",
          "value": 2
        }, {
          "label": "3",
          "value": 3
        }, {
          "label": "4",
          "value": 4
        }, {
          "label": "5",
          "value": 5
        }, {
          "label": "6",
          "value": 6
        }],
        publicFacilityOptions: [],
        privateFacilityOptions: [],
      }
    },
    computed: {},
    watch: {},
    created() {
      this.getPublicFacilityOptions();
      this.getPrivateFacilityOptions();
      this.getManagerOptions();
    },
    mounted() {},
    methods: {
      changeUrl(){
        this.$router.push("/loupan/addloupan")
      },
      changeRadio(value){
        if(value==0){
          this.shows=true
        }
        if(value==1){
          this.shows=false
        }
      },
      getManagerOptions(){
        getManagerOptions().then(resp=>{
          this.managerOptions = resp.data
        })
      },
      handleAvatarSuccess(res, file) {
        this.imageUrl = URL.createObjectURL(file.raw);
        this.formData.frontCover = res.data.url
      },
      beforeAvatarUpload(file) {
        const isJPG = file.type === 'image/jpeg';
        const isLt2M = file.size / 1024 / 1024 < 2;

        if (!isJPG) {
          this.$message.error('上传头像图片只能是 JPG 格式!');
        }
        if (!isLt2M) {
          this.$message.error('上传头像图片大小不能超过 2MB!');
        }
        return isJPG && isLt2M;
      },
      handleAvatarSuccesss(res, file) {
        this.imageUrls = URL.createObjectURL(file.raw);
        console.log(res)
        this.formData.pictureUrl = res.data.url;
      },
      beforeAvatarUploads(file) {
        const isJPG = file.type === 'image/jpeg';
        const isLt2M = file.size / 1024 / 1024 < 2;

        if (!isJPG) {
          this.$message.error('上传头像图片只能是 JPG 格式!');
        }
        if (!isLt2M) {
          this.$message.error('上传头像图片大小不能超过 2MB!');
        }
        return isJPG && isLt2M;
      },
      getPublicFacilityOptions(){
        getPublicFacilityOptions().then(resp=>{
          this.publicFacilityOptions = resp.data
        })
      },
      getPrivateFacilityOptions(){
        getPrivateFacilityOptions().then(resp=>{
          this.privateFacilityOptions = resp.data
        })
      },
      submitForm() {
        this.formData.publicFacility = this.formData.publicfacility.join();
        this.formData.privateFacility=this.formData.privatefacility.join();
        this.$refs['elForm'].validate(valid => {
          if (valid){
            addDistract(this.formData).then(resp=>{
              if(resp>0){
                alert("添加成功")
              }else{
                alert("添加失败")
              }
            })
          }else{
            alert("表单内信息不完整")
          }
        })
      },
      resetForm() {
        this.$refs['elForm'].resetFields()
      },
      handler ({BMap, map}) {
        let _this = this;  // 设置一个临时变量指向vue实例，因为在百度地图回调里使用this，指向的不是vue实例；
        let geolocation = new BMap.Geolocation();
        geolocation.getCurrentPosition(function(r){
          console.log(r);
          _this.center = {lng: r.longitude, lat: r.latitude};   // 设置center属性值
          _this.autoLocationPoint = {lng: r.longitude, lat: r.latitude};  // 自定义覆盖物
          _this.initLocation = true;
        },{enableHighAccuracy: true})
        window.map = map;

        /*let data = [
          { x: 121.48, y: 31.23, name: "黄浦区<br/>118套房" },
          { x: 116.09, y: 39.96, name: "门头沟区<br/>118套房" },
          { x: 121.43, y: 31.18, name: "徐汇区<br/>118套房" },
          { x: 121.45, y: 31.23, name: "静安区<br/>118套房" },
          { x: 121.5, y: 31.27, name: "虹口区<br/>118套房" },
          { x: 121.4, y: 31.25, name: "普陀区<br/>118套房" },
          { x: 121.48, y: 31.4, name: "宝山区<br/>118套房" },
          { x: 121.38, y: 31.12, name: "闵行区<br/>118套房" }
        ];
        data.forEach((e, i) => {
          // 创建point, 将x,y值传入
          let pointNumber = new BMap.Point(e.x, e.y);
          // 创建信息窗口对象
          // let detiail=new BMap.Point(e.x, e.y);
          // let infoWindow = new BMap.InfoWindow("World", {
          //   width: 150,     // 信息窗口宽度
          //   height: 100,     // 信息窗口高度
          //   title: e.x+","+e.y  // 信息窗口标题
          // });
          // 将data中的name加入地图中
          var label = new BMap.Label(e.name);
          label.setStyle({
            color: "black", //字体颜色
            fontSize: "13px", //字体大小
            padding: "18px 8px",
            backgroundColor: "white", //文本标注背景颜色
            borderRadius: "50px",
            border: "0",
            textAlign: "center",
            fontWeight: "bold" //字体加粗
          });
          markerFun(pointNumber, label);
        });


        function markerFun(points, label) {
          // let markers = new BMap.Marker(points);
          var myIcon = new BMap.Icon("/images/back.png", new BMap.Size(1, 1));
          var markers = new BMap.Marker(points, {icon: myIcon});
          map.addOverlay(markers); // 将标注添加到地图中

          markers.setLabel(label); // 将data中的name添加到地图中
          // 标注的点击事件
          label.addEventListener("click", function (event) {
            map.removeOverlay(markers);

            // map.openInfoWindow( points);//参数：窗口、点  根据点击的点出现对应的窗口
            map.centerAndZoom(points, 16);


            let ptdata = [
              {x: 121.4, y: 31.2456, name: "普陀一区<br/>102套"},
              {x: 121.4, y: 31.26, name: "普陀二区<br/>103套"},
              {x: 121.4, y: 31.2645, name: "普陀三区<br/>120套"},
              {x: 121.43, y: 31.18, name: "徐汇一区<br/>120套"},
              {x: 121.43, y: 31.19, name: "徐汇二区<br/>120套"},
            ];
            ptdata.forEach((e, i) => {
              // 创建point, 将x,y值传入
              let ptpointNumber = new BMap.Point(e.x, e.y);

              // 将data中的name加入地图中
              var ptlabel = new BMap.Label(e.name);
              ptlabel.setStyle({
                color: "black", //字体颜色
                fontSize: "13px", //字体大小
                padding: "15px 8px",
                backgroundColor: "white", //文本标注背景颜色
                borderRadius: "50px",
                border: "0",
                textAlign: "center",
                fontWeight: "bold" //字体加粗
              });
              ptmarkerFun(ptpointNumber, ptlabel);
            });

            function ptmarkerFun(ptpoints, ptlabel) {
              var ptmyIcon = new BMap.Icon(
                "/images/back.png",
                new BMap.Size(1, 1)
              );
              var ptmarkers = new BMap.Marker(ptpoints, {icon: ptmyIcon});
              // let ptmarkers = new BMap.Marker(ptpoints);
              map.addOverlay(ptmarkers); // 将标注添加到地图中
              ptmarkers.setLabel(ptlabel); // 将data中的name添加到地图中

            }
          });
*/

       // }
      },
      //点击地图监听
      clickEvent(e){
        map.clearOverlays();
        let Icon_0 = new BMap.Icon("http://api0.map.bdimg.com/images/marker_red_sprite.png", new BMap.Size(64, 64), {anchor: new BMap.Size(18, 32),imageSize: new BMap.Size(36, 25)});
        let myMarker = new BMap.Marker(new BMap.Point(e.point.lng, e.point.lat),{icon: Icon_0});
        map.addOverlay(myMarker);
        //用所定位的经纬度查找所在地省市街道等信息
        let point = new BMap.Point(e.point.lng, e.point.lat);
        let gc = new BMap.Geocoder();
        let _this = this;
        gc.getLocation(point, function (rs) {
          let addComp = rs.addressComponents;
          _this.locData.address = rs.address;

        });
        this.locData.longitude = e.point.lng;
        this.locData.latitude = e.point.lat;
        let data = [
          { x: e.point.lng, y: e.point.lat, name: "<br/>118套房" },

        ];

        data.forEach((e, i) => {
          // 创建point, 将x,y值传入
          let pointNumber = new BMap.Point(e.x, e.y);
          // 创建信息窗口对象
          // let detiail=new BMap.Point(e.x, e.y);
          // let infoWindow = new BMap.InfoWindow("World", {
          //   width: 150,     // 信息窗口宽度
          //   height: 100,     // 信息窗口高度
          //   title: e.x+","+e.y  // 信息窗口标题
          // });
          // 将data中的name加入地图中
          var label = new BMap.Label(e.name);
          label.setStyle({
            color: "black", //字体颜色
            fontSize: "13px", //字体大小
            padding: "18px 8px",
            backgroundColor: "white", //文本标注背景颜色
            borderRadius: "50px",
            border: "0",
            textAlign: "center",
            fontWeight: "bold" //字体加粗
          });
          markerFun(pointNumber, label);
        });
        function markerFun(points, label) {
          // let markers = new BMap.Marker(points);
          var myIcon = new BMap.Icon("/images/back.png", new BMap.Size(1, 1));
          var markers = new BMap.Marker(points, {icon: myIcon});
          map.addOverlay(markers); // 将标注添加到地图中

          markers.setLabel(label); // 将data中的name添加到地图中
          // 标注的点击事件
          label.addEventListener("click", function (event) {
            map.removeOverlay(markers);

            // map.openInfoWindow( points);//参数：窗口、点  根据点击的点出现对应的窗口
            map.centerAndZoom(points, 16);


            let ptdata = [
              {x: 121.4, y: 31.2456, name: "普陀一区<br/>102套"},
              {x: 121.4, y: 31.26, name: "普陀二区<br/>103套"},
              {x: 121.4, y: 31.2645, name: "普陀三区<br/>120套"},
              {x: 121.43, y: 31.18, name: "徐汇一区<br/>120套"},
              {x: 121.43, y: 31.19, name: "徐汇二区<br/>120套"},
            ];
            ptdata.forEach((e, i) => {
              // 创建point, 将x,y值传入
              let ptpointNumber = new BMap.Point(e.x, e.y);

              // 将data中的name加入地图中
              var ptlabel = new BMap.Label(e.name);
              ptlabel.setStyle({
                color: "black", //字体颜色
                fontSize: "13px", //字体大小
                padding: "15px 8px",
                backgroundColor: "white", //文本标注背景颜色
                borderRadius: "50px",
                border: "0",
                textAlign: "center",
                fontWeight: "bold" //字体加粗
              });
              ptmarkerFun(ptpointNumber, ptlabel);
            });

            function ptmarkerFun(ptpoints, ptlabel) {
              var ptmyIcon = new BMap.Icon(
                "/images/back.png",
                new BMap.Size(1, 1)
              );
              var ptmarkers = new BMap.Marker(ptpoints, {icon: ptmyIcon});
              // let ptmarkers = new BMap.Marker(ptpoints);
              map.addOverlay(ptmarkers); // 将标注添加到地图中
              ptmarkers.setLabel(ptlabel); // 将data中的name添加到地图中

            }
          });

        }




      },
//定位成功回调
      getLoctionSuccess(point, AddressComponent, marker){
        map.clearOverlays();
        let Icon_0 = new BMap.Icon("http://api0.map.bdimg.com/images/marker_red_sprite.png", new BMap.Size(64, 64), {anchor: new BMap.Size(18, 32),imageSize: new BMap.Size(36, 36)});
        let myMarker = new BMap.Marker(new BMap.Point(point.point.lng, point.point.lat),{icon: Icon_0});
        map.addOverlay(myMarker);
        this.locData.longitude = point.point.lng;
        this.locData.latitude = point.point.lat;
      },
//返回选中点的位置
      findlocation(){
        this.$emit("findlocdata",this.locData)
        this.temp.location=this.keyword
        this.temp.lng=this.locData.longitude
        this.temp.lat=this.locData.latitude
        this.mapVisible = false
      },
    },
    components: {
      Pagination,
      BaiduMap,
      BmNavigation,
      BmView,
      BmGeolocation,
      BmCityList,
      BmLocalSearch
    },
  }

</script>
<style>
  .el-upload__tip {
    line-height: 1.2;
  }
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>
